{% extends "./inc_base.html" %}
{% block content %}

<header class="mui-bar mui-bar-nav">
    <!--<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>-->
    <span class="mui-icon iconfont icon-cart"><span class="mui-badge">9</span></span>
    <h1 class="mui-title"><img src="/static/mobile/img/logo.png"></h1>
    <span class="mui-icon iconfont icon-search mui-pull-right"></span>
</header>
<nav class="mui-bar mui-bar-tab">
    <a class="mui-tab-item mui-action-back">
        <span class="mui-icon iconfont icon-back"></span>
        <span class="mui-tab-label">返回</span>
    </a>
    <a class="mui-tab-item" href="#SOHUCS">
        <span class="mui-icon iconfont icon-comment"></span>
        <span class="mui-tab-label">评论</span>
    </a>
    <a class="mui-tab-item" href="#shoucang">
        <span class="mui-icon iconfont icon-favor"></span>
        <span class="mui-tab-label">收藏</span>
    </a>
    <a class="mui-tab-item" href="#fenxiang">
        <span class="mui-icon iconfont icon-share"></span>
        <span class="mui-tab-label">分享</span>
    </a>

    {% if controller.is_login %}
    <a class="mui-tab-item" href="/center/index">
        <span class="mui-icon iconfont icon-my"></span>
        <span class="mui-tab-label">我的</span>
    </a>
    {%else%}
    <a class="mui-tab-item" href="/center/public/login">
        <span class="mui-icon iconfont icon-myfill"></span>
        <span class="mui-tab-label">登录</span>
    </a>
    {%endif%}

    <a class="mui-tab-item" href="#top">
        <span class="mui-icon iconfont icon-top"></span>
        <span class="mui-tab-label">顶部</span>
    </a>

</nav>
<div class="mui-content detail" style="background-color: #fff">
    <div class="mui-content-padded">
        <!-- 文章标题 -->
        <h1 class="title">{{info.title}}</h1>
        <div class="article-header">

            <div class="pgc-bar-top mui-clearfix">
                <a href="#" ga_category="toutiaohao" ga_label="" ga_event="click" class="avatar-link vwo-media-profile">
                    <div class="avatar">
                        <img src="/u/avatar/{{info.uid}}" class="avatar">
                    </div>
                </a>
                <div class="subtitle">
                    <p class="name"><a href="#" class="screen-name vwo-media-profile">
                            <span id="mediaName"
                                style="transform-origin: 0px 0px 0px; opacity: 1; transform: scale(1, 1);">{{info.uid|get_nickname}}</span>
                            <img src="/static/mobile/img/logo.png">
                        </a></p>
                    <a href="#" class="time vwo-media-profile">

                        <span class="original original-fix">原创</span>

                        <span>{{ info.update_time|moment('YYYY-MM-DD hh:mm') }}</span>
                    </a>
                </div>

            </div>
            {#
            <div class="favor-wrapper">
                <button type="button" class="mui-btn mui-btn-primary mui-btn-outlined">关注</button>
            </div>
            #}
        </div>

        <article class="article-content">
            <!--内容钩子加载-->
            {{content(pagehook)}}
            <!--/内容钩子加载结束-->
            {% if info.pan_link %}
            {% if controller.is_login %}
            {% if info.isShowPanLink === true %}
            <p style="background:rgb(166, 240, 163)">网盘地址：{{info.pan_link}}</p>
            {% else %}
            <p style="background:rgb(247, 132, 132)">你所在的用户组无法查看链接，请 <a href="/center/index">升级</a> 你所在的用户组</p>
            {% endif %}
            {% else %}
            <div style="background:rgb(247, 132, 132)">
                <p>内容仅限注册会员查看，登陆后下载地址会显示在下方：</p>
                <p>本文隐藏内容 <a href="/center/public/login" data-toggle="ajaxModal"><i class="fa fa-sign-in"></i> 登录</a>
                    后才可以浏览</p>
            </div>
            {% endif %}
            {% endif %}
        </article>
    </div>
    {{HOOK@documentDetailAfter|safe}}
</div>
{% endblock%}

{% block script %}
<script type="text/javascript">
    mui.init()
    var btn = document.querySelectorAll(".mui-bar-tab a.mui-tab-item");
    for (var i = 0; i < btn.length; i++) {
        btn[i].addEventListener("tap", function () {
            var href = this.getAttribute("href");
            if (href == "#top") {
                mui.scrollTo(0, 500);
            } else if (href == "#shoucang") {
                //todo
                mui.toast("功能开发中。。。")
                return
            } else if (href == "#fenxiang") {
                //todo
                mui.toast("功能开发中。。。")
                return
            } else {
                mui.openWindow({ url: href })
            }

        })
    }

</script>
{% endblock %}